﻿(function ($) {
    $.fn.lightweightbox = function () {
        return this.each(function () {
            var $anchor = $(this);
            var metadata = $anchor.parent().find('div.metadata').html();
            $anchor.click(function () {
                var $container = $('<div id="lightbox"><div></div></div>');
                var imageurl = $anchor.attr('href');
                var $image = $('<img src="' + imageurl + '" class="image" />');
                var info = $('<div id=\"metadata-container\">' + metadata + '</div>')
                info.hide();

                var $close = $('<a href="#" class="close"><img src="/images/close.png" alt="Stäng"></a>');
                var $info = $('<a href="#" class="info"><img src="/images/information.png" alt="Information"></a>');

                $container.find('div').append($image);
                $container.find('div').append($close);
                $container.find('div').append($info);
                $container.find('div').append(info);

                $('body').append($container);

                $close.click(close);

                $info.click(openInfo);

                $image.click(function (e) {
                    e.stopPropagation();
                });
                return false;

                function openInfo() {
                    info.fadeToggle();
                }

                function close() {
                    $container.fadeOut('fast', function () {
                        $container.remove();
                    })
                    return false;
                }
            });
        });

    }
})(jQuery);
